<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!doctype html>
<html class="no-js">
<head>
    <%@ include file="./../common/meta.jsp" %>
    <link rel="stylesheet" href="../../css/ecshop.css">
</head>
<body>
<header data-am-sticky class="am-header am-header-default am-no-layout">
    <div class="am-header-left am-header-nav">
      <span class="am-header-nav-title" id="city">
        获取中...
      </span>
    </div>
    <div class="box-search">
        <i class="icon-search text-icon">⌕</i>
        <input class="single-line" value="" placeholder="输入商家/品类/商圈">

    </div>
    <div class="am-header-right am-header-nav">
        <a href="./shopping-cart.jsp" class="">
            <i class="am-header-icon am-icon-shopping-cart"></i>
        </a>
    </div>
</header>


<div class="am-content">

    <div data-am-widget="slider" class="am-slider am-slider-default"
         data-am-slider='{"controlNav":"thumbnails","directionNav":false}' data-am-flexslider="{playAfterPaused: 2000}">
        <ul class="am-slides" id="index-slides">
            <%--<li>--%>
            <%--<img src="http://s.amazeui.org/media/i/demos/bing-1.jpg">--%>

            <%--</li>--%>
            <%--<li>--%>
            <%--<img src="http://s.amazeui.org/media/i/demos/bing-2.jpg">--%>

            <%--</li>--%>
            <%--<li>--%>
            <%--<img src="http://s.amazeui.org/media/i/demos/bing-3.jpg">--%>

            <%--</li>--%>
            <%--<li>--%>
            <%--<img src="http://s.amazeui.org/media/i/demos/bing-4.jpg">--%>

            <%--</li>--%>
        </ul>
    </div>

    <div class="sc-main">


        <div class="am-g">
            <div class="am-panel am-panel-default">
                <div class="am-panel-bd am-padding-xs">
                    <ul class="am-avg-sm-4 am-text-center index-btns" id="cataUl">

                    </ul>
                </div>
            </div>
        </div>
        <a href="./ecshop-list.jsp?type=23">
            <img class="sc01-img" src="../../img/sc01.png"/>
        </a>


        <style>
            .sc-box {
                background: #fff;
                display: -webkit-flex;
                display: flex;
                width: 100%;
                margin: 10px 0 0;
                padding: 0;
                list-style: none;
            }

            .sc-box .sc-box-l,
            .sc-box .sc-box-r {
                -webkit-flex: 1;
                flex: 1;

            }

            .sc-box .sc-box-l img {
                width: 97%;
            }

            .sc-box .sc-box-r {
                background: #fff;
                display: -webkit-flex;
                display: flex;
                width: 100%;
                padding: 0;
                list-style: none;
                -webkit-flex-direction: column;
                flex-direction: column;
            }

            .sc-box .sc-box-r img {
                width: 100%;
                /*height: 48%;*/
                margin: 0 2% 2% 0;
            }

            .sc-box .sc-box-r .t,
            .sc-box .sc-box-r .b {
                background: #fff;
                display: -webkit-flex;
                display: flex;
                width: 100%;
                padding: 0;
                list-style: none;
            }

            .sc-box .sc-box-r .t img,
            .sc-box .sc-box-r .b img {
                -webkit-flex: 1;
                flex: 1;
            }
        </style>
        <div class="sc-box">
            <div class="sc-box-l">
                <a href="./ecshop-list.jsp?type=23">
                    <img src="../../img/sc-1.png"/>
                </a>
            </div>
            <div class="sc-box-r">
                <div class="t">
                    <a href="./ecshop-list.jsp?type=21">
                        <img class="sc-box-r-1" src="../../img/sc-2.png"/>
                    </a>
                    <a href="./ecshop-list.jsp?type=116">
                        <img class="sc-box-r-2" src="../../img/sc-3.png"/>
                    </a>
                </div>
                <div class="b">
                    <a href="./ecshop-list.jsp?type=115">
                        <img class="sc-box-r-3" src="../../img/sc-4.png"/>
                    </a>
                    <a href="./ecshop-list.jsp?type=113">
                        <img class="sc-box-r-4" src="../../img/sc-5.png"/>
                    </a>
                </div>


            </div>

        </div>
        <a href="./ecshop-list.jsp">
            <img class="sc01-img" src="../../img/sc-6.png"/>
        </a>


        <div class="list-title">
            <h4>新人专享</h4>
            <a href="" class="more">更多</a>
        </div>

        <div class="mui-flex newProPannel" id="newProPannel">

        </div>


        <%--<div class="dzapp_all_type">--%>
        <%--<ul class="am-avg-sm-3 am-text-center index-btns" id="hotSaleUL">--%>

        <%--</ul>--%>
        <%--</div>--%>


        <%--<div class="list1-product">--%>
        <%--<ul class="am-avg-sm-2 boxes">--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<span class="info">--%>
        <%--<h3>新品促销</h3>--%>
        <%--<p>专题活动描述</p>--%>
        <%--</span>--%>
        <%--<span class="img">--%>
        <%--<img src="../../img/02.png"/>--%>
        <%--</span>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<span class="info">--%>
        <%--<h3>店庆回馈</h3>--%>
        <%--<p>饕餮盛宴 1折起</p>--%>
        <%--</span>--%>
        <%--<span class="img">--%>
        <%--<img src="../../img/03.png"/>--%>
        <%--</span>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<div class="info">--%>
        <%--<h3>新品上市</h3>--%>
        <%--<p>不限款式 周末特惠</p>--%>
        <%--</div>--%>
        <%--<div class="img">--%>
        <%--<img src="../../img/04.png"/>--%>
        <%--</div>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<div class="info">--%>
        <%--<h3>多买多送</h3>--%>
        <%--<p>多买多送 迎新大促</p>--%>
        <%--</div>--%>
        <%--<div class="img">--%>
        <%--<img src="../../img/05.png"/>--%>
        <%--</div>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--</ul>--%>
        <%--</div>--%>
        <%--<div class="am-g intro-list">--%>
        <%--<div class="am-u-sm-4 intro-img">--%>
        <%--<ul class="mui-flex">--%>

        <%--<li class="cell" style="">--%>
        <%--<a class="component type25" href=""--%>
        <%--style="padding:0px 0.5px 0.5px 0.5px;background-color:#ffffff;">--%>
        <%--<div class="title-con">--%>
        <%--<div class="title">--%>
        <%--<span class="am-icon-heart"></span>热销--%>
        <%--</div>--%>
        <%--<div class="sub-title">--%>
        <%--网红时尚搭配--%>
        <%--</div>--%>

        <%--</div>--%>
        <%--<div class="img-con">--%>
        <%--<img src="../../img/06.png" class="img-ks-lazyload">--%>
        <%--</div>--%>

        <%--</a>--%>
        <%--</li>--%>
        <%--</ul>--%>
        <%--</div>--%>
        <%--<div class="am-u-sm-8">--%>
        <%--<div class="mui-flex newProPannel" id="newProPannel">--%>

        <%--</div>--%>
        <%--</div>--%>
        <%--</div>--%>
        <%--<div class="list1-product">--%>
        <%--<ul class="am-avg-sm-2 boxes">--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<span class="info">--%>
        <%--<h3>新店促销</h3>--%>
        <%--<p>专题活动描述</p>--%>
        <%--</span>--%>
        <%--<span class="img">--%>
        <%--<img src="../../img/07.png"/>--%>
        <%--</span>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--<li class="box">--%>
        <%--<a href="">--%>
        <%--<span class="info">--%>
        <%--<h3>新店促销</h3>--%>
        <%--<p>专题活动描述</p>--%>
        <%--</span>--%>
        <%--<span class="img">--%>
        <%--<img src="../../img/08.png"/>--%>
        <%--</span>--%>
        <%--</a>--%>
        <%--</li>--%>
        <%--</ul>--%>
        <%--</div>--%>
    </div>
</div>
<%@ include file="./../common/footerNav.jsp" %>
<%@ include file="./../common/footer.jsp" %>
<script id="banner-template" type="text/x-handlebars-template">
    {{#each productBanner}}
    <li>
        <a href="../../app/ecshop/ecshop-detail.jsp?pid={{id}}">
            <img src="{{../imgRoot}}{{picture}}" style="height: 250px"/>
        </a>
    </li>
    {{/each}}
</script>

<script id="cata-template" type="text/x-handlebars-template">
    {{#each cataList}}
    <li class="am-padding-xs">
        <a href="../../app/ecshop/ecshop-list.jsp?type={{id}}" data-am-modal="{target: '#goodCats'}">
            <p>
                <img class="sc-item-img" src="../../img/{{code}}.png" alt=""/>
            </p>
            <p>{{name}}</p>
        </a>
    </li>
    {{/each}}
</script>
<script id="hotSale-template" type="text/x-handlebars-template">

    {{#each hotProduct}}
    <li class="list_1">
        <a href="../../app/ecshop/ecshop-detail.jsp?pid={{id}}">
            <img src="{{../imgRoot}}{{picture}}" width="100%"/>
        </a>
        <p>{{name}}</p>
        <div class="">
            <span class="love-item-price c_FF4200"><i>{{nowPrice}}</i>元</span>
            <span class="love-item-price line-through"><i>{{price}}</i>元</span>
        </div>
    </li>
    {{/each}}
</script>
<script id="newPro-template" type="text/x-handlebars-template">
    {{#each newProduct}}
    <div class="am-u-sm-3">
        <div class="am-thumbnail">
            <a href="../../app/ecshop/ecshop-detail.jsp?pid={{id}}" alt="-">
                <img src="{{../imgRoot}}{{picture}}" alt=""/>
            </a>
            <h3 class="am-thumbnail-caption">{{name}}</h3>
            <span class="price">¥{{nowPrice}}元</span>
        </div>
    </div>
    {{/each}}
</script>
<script src="../../js/common/common.js"></script>
<script src="../../js/ecshop/ecshop.js"></script>
</body>


<script src="http://api.map.baidu.com/api?v=2.0&ak=abcs"></script>
<script type="text/javascript">

    var geolocation = new BMap.Geolocation();
    var gc = new BMap.Geocoder();

    geolocation.getCurrentPosition(function (r) {   //定位结果对象会传递给r变量

                if (this.getStatus() == BMAP_STATUS_SUCCESS) {  //通过Geolocation类的getStatus()可以判断是否成功定位。
                    var pt = r.point;
                    gc.getLocation(pt, function (rs) {
                        var addComp = rs.addressComponents;
                        $("#city").html(addComp.city);
                    });
                }
                else {
                    //关于状态码
                    //BMAP_STATUS_SUCCESS   检索成功。对应数值“0”。
                    //BMAP_STATUS_CITY_LIST 城市列表。对应数值“1”。
                    //BMAP_STATUS_UNKNOWN_LOCATION  位置结果未知。对应数值“2”。
                    //BMAP_STATUS_UNKNOWN_ROUTE 导航结果未知。对应数值“3”。
                    //BMAP_STATUS_INVALID_KEY   非法密钥。对应数值“4”。
                    //BMAP_STATUS_INVALID_REQUEST   非法请求。对应数值“5”。
                    //BMAP_STATUS_PERMISSION_DENIED 没有权限。对应数值“6”。(自 1.1 新增)
                    //BMAP_STATUS_SERVICE_UNAVAILABLE   服务不可用。对应数值“7”。(自 1.1 新增)
                    //BMAP_STATUS_TIMEOUT   超时。对应数值“8”。(自 1.1 新增)
                    switch (this.getStatus()) {
                        case 2:
                            alert('位置结果未知 获取位置失败.');
                            break;
                        case 3:
                            alert('导航结果未知 获取位置失败..');
                            break;
                        case 4:
                            alert('非法密钥 获取位置失败.');
                            break;
                        case 5:
                            alert('对不起,非法请求位置  获取位置失败.');
                            break;
                        case 6:
                            alert('对不起,当前 没有权限 获取位置失败.');
                            break;
                        case 7:
                            alert('对不起,服务不可用 获取位置失败.');
                            break;
                        case 8:
                            alert('对不起,请求超时 获取位置失败.');
                            break;

                    }
                }

            },
            {enableHighAccuracy: true}
    )

</script>


</html>